<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>编辑店铺</title>
<script type="text/javascript" src="../js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=LjNSOHRbk1AnuLidHYUWmvZQ"></script>
<style>*{ margin:0px; padding:0px;}</style>
</head>
<body style="margin:0px; padding:0px;"> 
	 <div style="width:798px;height:420px;border:1px solid #cccccc" id="allmap"></div> 
     <p style="font-size:12px; margin:2px auto; color:#F00"><input id="startBtn" type="button" onClick="startTool();" value="开启取点工具" style="padding:2px 3px; border:#CCC solid 1px; width:85px;"/> <input type="button" onClick="map.clearOverlays();parent.document.getElementById('samplespoint').value = '';points=[]; getBoundary('{$map_paths}','',2,0.5,'','blue');" value="清除" style="padding:2px 3px; border:#CCC solid 1px; width:85px;"/>&nbsp;&nbsp;注：请在蓝色框里选择经纬度。</p>
</body>  
</html>
<script type="text/javascript">
var map = new BMap.Map("allmap");// 创建Map实例
map.centerAndZoom("南宁", 14);     // 初始化地图,设置中心点坐标和地图级别
map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件
map.enableScrollWheelZoom();    //启用滚轮放大缩小，默认禁用
map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用

var key = 1;    //开关
var newpoint;   //一个经纬度
var points = [];    //数组，放经纬度信息
var polyline = new BMap.Polyline(); //折线覆盖物

function startTool(){   //开关函数
	if(key==1){
        document.getElementById("startBtn").style.background = "green";
        document.getElementById("startBtn").style.color = "white";
        document.getElementById("startBtn").value = "开启状态";
        key=0;
    }else{
        document.getElementById("startBtn").style.background = "red";
        document.getElementById("startBtn").value = "关闭状态";
        key=1;
    }
}
map.addEventListener("click",function(e){   //单击地图，形成折线覆盖物
    if(key==0){
        var marker = new BMap.Marker(new BMap.Point(e.point.lng,e.point.lat));  // 创建标注
		map.addOverlay(marker);              // 将标注添加到地图中
        parent.document.getElementById("coordinates").value = e.point.lng + "," + e.point.lat;    //输出数组里的经纬度
    }
});

function getBoundary(point,strokeWeight,strokeOpacity,fillColor,strokeColor){ 
	map.clearOverlays();        //清除地图覆盖物  
	if(point){
		var key = new BMap.Polygon(point, { strokeWeight: strokeWeight, strokeOpacity:strokeOpacity, fillColor:fillColor, strokeColor: strokeColor ,strokeStyle : 'dashed' }); //建立多边形覆盖物
		map.addOverlay(key);  //添加覆盖物 
		setTimeout(function(){ map.setViewport(key.getPath()); },1000);
		
		var samplespoint_v = point.split(',');
		var samplespoint = new BMap.Marker(new BMap.Point(samplespoint_v[0],samplespoint_v[1]));
		map.addOverlay(samplespoint);
	}
}

$(document).ready(function(){
	getBoundary("{$coordinates}",2,0.5,"","blue");
});

</script>